import { Card, Form, Input, Button,Select } from "antd"
import { useEffect, useState } from "react";
import { useHistory, useParams } from "react-router-dom/cjs/react-router-dom.min"
import FxyhsjglApi from "../../../../../../utils/apis/FxyhsjglApi";
import FetchHelper from "../../../../../../utils/helper/fetch-helper";
import MapPoint from '../../../../../framework/MapPoint';

import TextArea from "antd/es/input/TextArea";
export default function FxyhsjAdd() {
    const fxyhKeyPath = useParams()?.keyPath
    const [form] = Form.useForm();
    const [fxyhAddDynamicForms, setFxyhAddDynamicForms] = useState();;
    const history = useHistory();
    useEffect(() => {
        FxyhsjglApi.fxyhAddDynamicApi().then(datas => {
            console.log(datas)
            setFxyhAddDynamicForms(datas)
        })
    }, [])
    const quxiaoHandle = () => {
        history.push(`/manager/fxyhsjgl`)
    }
    const onFinish = (values) => {
        FetchHelper.postJson(`/admin-api/ybyj/yhsj`, values).then(alert('新增成功！'))
    }
    return <div className='layout-h h100' style={{
        overflow: "scroll"
    }}>
        {/* <Card className='h100 fill' style={{
            position: "relative",
        }} >
            <BusinessMap />

        </Card> */}

        <Card className='h100 fill'>
            <Form method="post"
                onFinish={onFinish}
                form={form}>
                <header style={{
                    fontSize: 20,
                    fontWeight: "bold"
                }}>隐患数据新增</header>
                <hr />
                <div className="InputForm" style={{
                    flex: "flex",
                    flexWrap: "wrap"
                }}>
                    {fxyhAddDynamicForms !== undefined && fxyhAddDynamicForms.map(formItem => {
                        let node;
                        switch (formItem.type) {
                            case 'Textarea':
                                node = <TextArea></TextArea>;
                                break;
                            case 'map':
                                node = <MapPoint></MapPoint>;
                                break;
                            case 'select':
                                node = <Select onSelect={()=>{

                                }}>
                                    {formItem.child.map(e=>{
                                        return  <Select.Option value={e}>{e}</Select.Option>
                                    })}
                                {/* <Select.Option value="翠屏区">翠屏区</Select.Option>
                                <Select.Option value="南溪区">南溪区</Select.Option>
                                <Select.Option value="叙州区">叙州区</Select.Option>
                                <Select.Option value="江安县">江安县</Select.Option>
                                <Select.Option value="长宁县">长宁县</Select.Option>
                                <Select.Option value="高县">高县</Select.Option>
                                <Select.Option value="珙县">珙县</Select.Option>
                                <Select.Option value="筠连县">筠连县</Select.Option>
                                <Select.Option value="兴文县">兴文县</Select.Option>
                                <Select.Option value="屏山县">屏山县</Select.Option>
                                <Select.Option value="两海新区">两海新区</Select.Option>
                                <Select.Option value="三江新区">三江新区</Select.Option> */}
                              </Select>;;
                                break;
                            case 'input':
                            default:
                                node = <Input style={{
                                    width: "90%"
                                }}
                                // defaultValue={formItem.alias==="承灾体大类"?formItem.alias:undefined}

                                />
                        }
                        // const initialValue=cztAddDynamicForms[formItem.alias]==="承灾体大类"?cztAddDynamicForms[formItem.alias]:undefined;
                        return <div style={{
                            flexBasis: "33%",
                            marginBottom: "10px"
                        }}>
                            <Form.Item
                                label={formItem.alias}
                                name={formItem.name}
                                rules={formItem.rule}

                            // initialValue={formItem.alias==="承灾体小类"?cztkeyPath:undefined}
                            >
                                {node}
                            </Form.Item>
                        </div>
                    })}
                </div>


                <div className="layout-h">
                    <Button className="btn1"
                        type="primary"
                        htmlType="submit"

                    // onClick={e => {
                    //     form.validateFields().then(values => {
                    //         // axios.post("/ybyj/cztjcb",values.target.value)


                    //     }).catch(err => {
                    //         console.log("上传失败")
                    //     })
                    // }}

                    >新增</Button>

                    <Button onClick={quxiaoHandle} className="btn2">返回</Button>
                </div>

            </Form>
        </Card>


    </div>
}